<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org"
      xmlns:shiro="http://www.pollix.at/thymeleaf/shiro">
<head th:include="include :: header"></head>
<body class="hold-transition skin-blue sidebar-mini">

<section class="content-header">
    <h1>总调计划查询</h1>
</section>
<section class="content">
    <div class="row">
        <div class="col-xs-12">
            <div class="box">
                <div class="box-header">
                    <form id="queryForm" onsubmit="return false;">
                        <div class="row">
                            <div class="form-inline">
                                <div class="form-group">
                                    <label for="query-prodNo">生产令号</label>
                                    <input id="query-prodNo" type="text" name="prodNo" class="form-control"
                                           placeholder="请输入生产令号">
                                </div>
                                <div class="form-group">
                                    <label for="query-proName">项目名称</label>
                                    <input id="query-proName" type="text" name="proName" class="form-control"
                                           placeholder="请输入项目名称">
                                </div>
                                <div class="form-group">
                                    <label for="query-customer">需方</label>
                                    <input id="query-customer" type="text" name="customer" class="form-control"
                                           placeholder="请输入需方">
                                </div>
                                <div class="form-group">
                                    <label for="query-insSite">安装地点</label>
                                    <input id="query-insSite" type="text" name="insSite" class="form-control"
                                           placeholder="请输入安装地点">
                                </div>
                                <div class="form-group">
                                    <label for="query-prodTyp">设备类型</label>
                                    <select id="query-prodTyp" class="form-control" name="prodTyp">
                                        <option value="" selected>全部</option>
                                        <option value="1">设备类</option>
                                        <option value="2">其他类</option>
                                    </select>
                                </div>
                                <div class="form-group">
                                    <label for="query-prodIsKey">是否重点项目</label>
                                    <select id="query-prodIsKey" class="form-control" name="prodIsKey">
                                        <option value="" selected>全部</option>
                                        <option value="1">是</option>
                                        <option value="2">否</option>
                                    </select>
                                </div>
                                <div class="form-group">
                                    <label for="query-prodManSta">生产令状态</label>
                                    <select id="query-prodManSta" class="form-control" name="prodManSta">
                                        <option value="1" selected>正常</option>
                                        <option value="2">终止</option>
                                        <option value="3">暂缓</option>
                                    </select>
                                </div>
                                <div class="form-group">
                                    <label for="query-prodCodSta">生产完成状态</label>
                                    <select id="query-prodCodSta" class="form-control selectpicker" name="prodCodSta"
                                            multiple>
                                        <option value="0" selected>未开始</option>
                                        <option value="2" selected>执行中</option>
                                        <option value="1">已完成</option>
                                    </select>
                                    <input name="prodCodStaText" type="hidden" value="0,2" style="display: none"/>
                                </div>
                                <div class="form-group">
                                    <label for="query-taskType">计划类型</label>
                                    <select id="query-taskType" class="form-control" name="taskType">
                                        <option value="" selected>全部</option>
                                        <option value="工艺">工艺</option>
                                        <option value="下料">下料</option>
                                        <option value="铆焊">铆焊</option>
                                        <option value="机加">机加</option>
                                        <option value="装配">装配</option>
                                        <option value="发货">发货</option>
                                        <option value="安装">安装</option>
                                    </select>
                                </div>
                                <div class="form-group">
                                    <label for="query-taskType">参与部门</label>
                                    <select id="query-dept" class="form-control" name="propDutyDept">
                                        <option value="" selected>全部</option>
                                        <option th:each="dept : ${deptList}" th:value="${dept.name}"
                                                th:text="${dept.name}"></option>
                                    </select>
                                </div>
                                <div class="form-group">
                                    <label for="query-startTime">计划完成时间</label>
                                    <input id="query-startTime" type="text" class="form-control datepicker"
                                           name="startTime"
                                           readonly="readonly"/>
                                    <label for="query-endTime"> 至 </label>
                                    <input id="query-endTime" type="text" class="form-control datepicker" name="endTime"
                                           readonly="readonly"/>
                                </div>
                                <button type="button" class="btn btn-success" id="btn-search"
                                        onclick="js.table.search(table)">
                                    <span class="Bold">搜索</span>
                                </button>
                            </div>
                        </div>
                    </form>
                </div>
                <div class="box-body">
                    <table id="bootstrap-table"></table>
                </div>
            </div>
        </div>
    </div>
</section>
<div th:include="include :: footer"></div>
<script th:inline="javascript">

    let table;

    $(function () {

        /** 多选状态 */
        $("#queryForm [name='prodCodSta']").change(function () {
            $("#queryForm [name='prodCodStaText']").val($("#queryForm [name='prodCodSta']").val());
        })

        /** 加载列表 */
        table = js.table.init({
            url: ctx + "task/planQuery/list",
            showColumns: true,
            showExport: true,
            columns: [
                {
                    title: '序号', field: 'id', width: '50',
                    formatter: function (value, row, index) {
                        return index + 1;
                    }
                },
                {
                    title: "生产令号",
                    field: 'prodNo',
                    formatter: function (value, row, index) {
                        let div = "<div style='width:60px;'>" + value + "</div>";
                        return div;
                    }
                },
                {
                    title: "数量", field: 'prodNum',
                    formatter: function (value, row, index) {
                        let div = "<div style='width:20px;'>" + value + "</div>";
                        return div;
                    }
                },
                {
                    title: "项目名称", field: 'proName',
                    formatter: function (value, row, index) {
                        let div = "<div style='width:60px;'>" + value + "</div>";
                        return div;
                    }
                },
                {
                    title: "需方", field: 'customer',
                    formatter: function (value, row, index) {
                        let div = "<div style='width:60px;'>" + value + "</div>";
                        return div;
                    }
                },
                {
                    title: "交货时间", field: 'prodDelDat',
                    formatter: function (value, row, index) {
                        if(value==null){
                            value = "-";
                        }
                        let div = "<div style='width:50px;'>" + value + "</div>";
                        return div;
                    }
                },
                {
                    title: "设备<br>类型", field: 'prodTyp',
                    formatter: function (value, row) {
                        if (value === 1) {
                            return "<div style='width:45px;'>设备类</div>";
                        } else if (value === 2) {
                            return "<div style='width:45px;'>其他类</div>";
                        }
                    }
                },
                {
                    title: "是否<br>重点", field: 'prodIsKey', width: '40',
                    formatter: function (value, row) {
                        if (value === 1) {
                            return "<div style='width:20px;'>是</div>";
                        } else if (value === 2) {
                            return "<div style='width:20px;'>否</div>";
                        }
                    }
                },
                {
                    title: "生产令<br>状态", field: 'prodManSta',
                    formatter: function (value, row) {
                        if (value === 1) {
                            return '<span style="width:40px;" class="badge label-success">正常</span>';
                        } else if (value === 2) {
                            return '<span style="width:40px;" class="badge label-danger">终止</span>';
                        } else if (value === 3) {
                            return '<span style="width:40px;" class="badge label-warning">暂缓</span>';
                        }
                    }
                },
                {
                    title: "工艺计划<br>完成时间", field: 'gyPlaEndDat',
                    formatter: function (value, row, index) {
                        if(value==null){
                            value = "-";
                        }
                        let div = "<div style='width:50px;'>" + value + "</div>";
                        return div;
                    }
                },
                {
                    title: "下料计划<br>完成时间", field: 'xlPlaEndDat',
                    formatter: function (value, row, index) {
                        if(value==null){
                            value = "-";
                        }
                        let div = "<div style='width:50px;'>" + value + "</div>";
                        return div;
                    }
                },
                {
                    title: "铆焊计划<br>完成时间", field: 'mhPlaEndDat',
                    formatter: function (value, row, index) {
                        if(value==null){
                            value = "-";
                        }
                        let div = "<div style='width:50px;'>" + value + "</div>";
                        return div;
                    }
                },
                {
                    title: "机加计划<br>完成时间", field: 'jjPlaEndDat',
                    formatter: function (value, row, index) {
                        if(value==null){
                            value = "-";
                        }
                        let div = "<div style='width:50px;'>" + value + "</div>";
                        return div;
                    }
                },
                {
                    title: "装配计划<br>完成时间", field: 'zpPlaEndDat',
                    formatter: function (value, row, index) {
                        if(value==null){
                            value = "-";
                        }
                        let div = "<div style='width:50px;'>" + value + "</div>";
                        return div;
                    }
                },
                {
                    title: "发货计划<br>完成时间", field: 'fhPlaEndDat',
                    formatter: function (value, row, index) {
                        if(value==null){
                            value = "-";
                        }
                        let div = "<div style='width:50px;'>" + value + "</div>";
                        return div;
                    }
                },
                {
                    title: "安装计划<br>完成时间", field: 'azPlaEndDat',
                    formatter: function (value, row, index) {
                        if(value==null){
                            value = "-";
                        }
                        let div = "<div style='width:50px;'>" + value + "</div>";
                        return div;
                    }
                },
                {
                    title: "生产<br>完成<br>状态", field: 'prodCodSta', width: '100',
                    formatter: function (value, row) {
                        if (value === 0) {
                            return '<span style="width:48px;" class="badge label-inverse">未开始</span>';
                        } else if (value === 1) {
                            return '<span style="width:48px;" class="badge label-success">已完成</span>';
                        } else if (value === 2) {
                            return '<span style="width:48px;" class="badge label-warning">执行中</span>';
                        }
                    }
                },
                {
                    title: "参与部门", field: 'propDutyDept',
                    formatter: function (value, row) {
                        if (value != undefined && value != null) {
                            let strArray = value.split(',');
                            let htmls = "";
                            for (let i = 0; i < strArray.length; i++) {
                                htmls += '<span class="badge label-default" style="border: #000000 1px solid;color:#000000;background: transparent;display: block;margin: 8px auto;padding: 10px;">' + strArray[i] + '</span>'
                            }
                            return htmls;
                        } else {
                            return '-';
                        }
                    }
                },
                {
                    title: "操作", width: '90',
                    formatter: function (value, row) {
                        let actions = [];

                        if (row.prodTyp === 1) {
                            // 设备类
                            actions.push('<a class="btn btn-info btn-xs" target="_blank" href="' + ctx + 'task/prodOrdQuery/single/' + row.prodNo + '" >查看进度看板</a>');
                            actions.push('<a class="btn btn-info btn-xs" target="_blank" href="' + ctx + 'task/scheduling/see/' + row.prodId + '" >查看排产计划</a>');
                        } else if (row.prodTyp === 2) {
                            // 其他
                            actions.push('<a class="btn btn-info btn-xs" target="_blank" href="' + ctx + 'task/scheduling/other/' + row.prodId + '/other" >查看进度看板</a>');
                            actions.push('<a class="btn btn-info btn-xs" target="_blank" href="' + ctx + 'task/common/see/' + row.prodId + '" >查看排产计划</a>');
                        }

                        return actions.join('');
                    }
                }
            ]
        });


    })
    ;
</script>
</body>
</html>
